<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>书籍</title>
    <link rel="stylesheet" href="//at.alicdn.com/t/c/font_4588818_ckhq99mzshn.css">
    <link rel="stylesheet" href="../css/zhuye.css">
    <link rel="stylesheet" href="../css/styles.css">
</head>

<body>
    <div class="dhl1">
        <div class="head">
            <!-- 头像 -->
            <div class="head-logo">
                <img src="./img/a.webp" alt="">
            </div>
            <!-- 名字 -->
            <div class="head-name">
                <a href="#">
                    <h3>第十组</h3>
                </a>
            </div>
            <!-- 搜索框 -->
            <div class="head-search">
                <div class="shell">
                    <input type="text"id="searchInput" placeholder="Search" >
                    <a href="#">
                        <img src="./img/fangdajing.png">
                    </a>
                </div>
            </div>
            <!-- 其他 -->
            <div class="head-other">
                <ul>
                    <li><a href="../../首页/HTML/╓≈╥│.html">首页</a></li>
                    <li><a href="../../kc/kc.html">课程</a></li>
                    <li><a href="../../论坛/新闻.html">论坛</a></li>
                    <li><a href="../../书籍/shuji.html">书籍</a></li>
                    <li><a href="../../我的主页/我的主页.html">我的</a></li>
                </ul>
            </div>
        </div>
        </div>
        <div class="dhl2">
        <div class="small">
            <img src="./img/small.png" width="45px" class="xlcdan">
            <div class="dhl2grxx">
                <img src="./img/a.webp">
                <p>第十组</p>
                </div>
              <div class="dhl2search">
                <input type="text" placeholder="Search" class="inputBox">
                <img src="./img/fangdajing.png" >
              </div>
        </div>
        <div class="dropDownMenu">
            <div class="xlcd2head">
                <ul>
                    <li><a href="../../首页/HTML/╓≈╥│.html">首页</a></li>
                    <li><a href="../../kc/kc.html">课程</a></li>
                    <li><a href="../../论坛/新闻.html">论坛</a></li>
                    <li><a href="../../书籍/shuji.html">书籍</a></li>
                    <li><a href="../../我的主页/我的主页.html">我的</a></li>
                </ul>
            </div>
        </div>
        </div>
    <div class="shujizongti">
        <div id="nav1">
            <p id="variety">书籍分类</p>
            <ul class="fenlei">
                <li class="slide-one"></li>
                <li class="slide-two"></li>
                <li class="leixing"><a href="../shuji.html" class="biaoqian">
                        <p class="type">HTML</p>
                    </a></li>
                <li class="leixing"><a href="./CSS.html" class="biaoqian">
                        <p class="type">CSS</p>
                    </a></li>
                <li class="leixing"><a href="./JavaScript.html" class="biaoqian">
                        <p class="type">JAVASCRIPT</p>
                    </a></li>
                <li class="leixing"><a href="./VUE.html" class="biaoqian">
                        <p class="type">VUE</p>
                    </a></li>
                <li class="leixing"><a href="./PYTHON.html" class="biaoqian">
                        <p class="type">PYTHON</p>
                    </a></li>
                <li class="leixing"><a href="./Java.html" class="biaoqian">
                        <p class="type">JAVA</p>
                    </a></li>
                <li class="leixing"><a href="./C.html" class="biaoqian">
                        <p class="type">C</p>
                    </a></li>
                <li class="leixing"><a href="./C++.html" class="biaoqian">
                        <p class="type">C++</p>
                    </a></li>
                <li class="leixing"><a href="./C11--.html" class="biaoqian">
                        <p class="type">C#</p>
                    </a></li>
                <li class="leixing"><a href="./GO.html" class="biaoqian">
                        <p class="type">GO</p>
                    </a></li>
                <li class="leixing"><a href="./SQL.html" class="biaoqian">
                        <p class="type">SQL</p>
                    </a></li>
                <li class="leixing"><a href="./LINUX.html" class="biaoqian">
                        <p class="type">LINUX</p>
                    </a></li>
                <li class="leixing"><a href="./JQUERY.html" class="biaoqian">
                        <p class="type">JQUERY</p>
                    </a></li>
            </ul>
        </div>
        <div class="books">
            <div class="bookcontainer">
                <a href="https://fanqienovel.com/page/7109745886753721352?enter_from=search" class="bookname"
                    target="_blank"><img src="../images/SQL-1.jpg" alt="" class="cover" style="margin-top: 20px;"></a>
                <div class="zhengwen">
                    <h3>数据库技术与应用——SQL Server 2008
                    </h3>
                    <span class="highlight-text">作者：李曼 张红娟</span><span class="span one">已完结 · 计算机</span><span
                        class="span two">13.8万字
                        · 未满1000人在读</span>
                    <span class="span three">收藏数：99 点击数：1000+</span>
                    <p class="p four">
                        本书内容包括安装SQLServer2008、数据库的基本概念、创建和维护数据库、创建和维护数据表、创建和维护约束、创建数据库关系图、插入、修改和删除表中数据、使用T-SQL查询表中数据、使用T-SQL进行程序设计、创建和执行存储过程、创建和测试触发器、创建视图、索引和事务、SQLServer2008的安全性管理、数据库的备份和恢复、数据的导入导出和设计输出报表。
                    </p>
                </div>
            </div>
            <div class="bookcontainer">
                <a href="https://fanqienovel.com/page/7103803194978864165?enter_from=search" class="bookname"
                    target="_blank"><img src="../images/SQL-2.jpg" alt="" class="cover"></a>
                <div class="zhengwen">
                    <h3>关系数据库与SQL Server（2019版）
                    </h3>
                    <span class="highlight-text">作者：主编 段利文 龚小勇</span><span class="span one">已完结 · 计算机</span><span
                        class="span two">13.9万字 · 未满1000人在读</span>
                    <span class="span three">收藏数：96 点击数：1000+</span>
                    <p class="p four">本书是普通高等教育“十一五”规划教材《关系数据库与SQL Server 2005》的第3次修订版和升级版。
                        本书根据职业岗位能力要求和行业需求进行编写。通过“学生成绩管理系统”案例，以项目任务为载体，以数据库应用程序的开发技能为主线，全面、系统地介绍了关系数据库的基本原理和SQL Server
                        2019数据库应用系统的开发技术。全书共12个模块，包括：认识关系数据库、安装和配置数据库、创建和管理数据库、创建和管理数据表、查询数据、创建与管理视图和索引、创建规则和默认值、T-SQL编程与应用、创建存储过程和触发器、数据库安全管理、维护与管理数据库以及综合应用实例。每个模块不仅包括知识目标、能力目标、学习导航、项目和任务等内容，还以类型丰富的习题和课外实践的形式配备了大量的来自工程实践领域的应用实例。
                        本书可作为高职高专院校电子信息大类及相关专业的数据库技术教材，也可供SQL Server数据库应用系统开发人员参考。
                    </p>
                </div>
            </div>
            <div class="bookcontainer">
                <a href="https://fanqienovel.com/page/7314159480902519860?enter_from=search" class="bookname"
                    target="_blank"><img src="../images/SQL-3.jpg" alt="" class="cover"></a>
                <div class="zhengwen">
                    <h3>SQL SERVER 2008数据库案例教程
                    </h3>
                    <span class="highlight-text">作者：吕树红 王晓娟 印元军主编</span><span class="span one">已完结 · 计算机</span><span
                        class="span two">17.6万字
                        · 未满1000人在读</span>
                    <span class="span three">收藏数：90 点击数：1000+</span>
                    <p class="p four">
                        数据库技术是计算机领域中重要的技术分支，是高职计算机专业的必修课程。本书全面系统的讲述微软SQLSERVER2008数据库管理核心技术，包括数据库、数据表、数据查询、索引、视图、T—SQL语言、存储过程、触发器、安全管理等内容。内容翔实、示例丰富、技术实用。

                    </p>
                </div>
            </div>
            <div class="bookcontainer">
                <a href="https://fanqienovel.com/page/7220994374123916326?enter_from=search" class="bookname"
                    target="_blank"><img src="../images/Java-1.jpg" alt="" class="cover"></a>
                <div class="zhengwen">
                    <h3>亿级流量Java高并发与网络编程实战</h3>
                    <span class="highlight-text">作者：颜群</span><span class="span one">已完结 · 成人教育</span><span
                        class="span two">28.1万字
                        · 未满1000人在读</span>
                    <span class="span three">收藏数：89 点击数：1000+</span>
                    <p class="p four">
                        《亿级流量Java高并发与网络编程实战》系统全面的介绍了开发人员必学的知识，如JVM、网络编程、NIO等知识，让开发人员系统地掌握JAVA高并发与网络编程知识。《亿级流量Java高并发与网络编程实战》分为10章。
                    </p>
                </div>
            </div>
            <div class="bookcontainer">
                <a href="https://fanqienovel.com/page/7103792648623754270?enter_from=search" class="bookname"
                    target="_blank"><img src="../images/Java-2.jpg" alt="" class="cover"></a>
                <div class="zhengwen">
                    <h3>Java程序设计基础教程
                    </h3>
                    <span class="highlight-text">作者：芮素娟 周艺 汪荣斌</span><span class="span one">已完结 · 计算机</span><span
                        class="span two">11.6万字
                        · 未满1000人在读</span>
                    <span class="span three">收藏数：89 点击数：1000+</span>
                    <p class="p four">
                        本书是面向Java初学者的入门级图书，以通俗易懂的语言详细讲解Java语言的基础知识。本书共分为10个单元，其中前9个单元共27个任务和26个实训，内容主要包括Java环境搭建、Java语法基础、面向对象的概念与思想、Java常用的类库、异常处理、线程、输入/输出功能、图形用户界面设计等。*后一个单元是一个综合实例，介绍Java程序如何设计、实现、编写和运行等操作。
                        本书是重庆市骨干专业的移动应用开发专业“Java程序设计”课程的配套教材。该项目提供了微课视频及操作演示视频，在超星学银在线平台可以使用。
                        本书体系完整，结构案例合理，可操作性强，内容深入浅出，语言通俗易懂，每个知识点都有配套例题进行解释说明，可作为高职院校计算机及相关专业的教学参考书。
                    </p>
                </div>
            </div>
            <div class="pagination">
                <button id="prevPageBtn" disabled>上一页</button>
                <span id="pageInfo">第1页</span>
                <button id="nextPageBtn">下一页</button>
            </div>
        </div>
    </div>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
    <script src="../js/pagination.js"></script>
    <script src="../js/导航栏.js"></script>
    <script>
        $("#nav1 .biaoqian").on("click", function (e) {
            e.preventDefault(); // 阻止默认链接行为
            var $this = $(this);
            var position = $this.parent().position();
            var width = $this.parent().width();

            // 动画持续时间
            var DonghuaTime = 450;

            $("#nav1 .slide-one").css({ opacity: 1, top: position.top, width: width });

            // 动画结束后的跳转
            setTimeout(function () {
                window.location.href = $this.attr("href"); // 跳转到链接
            }, DonghuaTime);
        });

        // 初始设置slide-one的位置和宽度
        $(document).ready(function () {
            var currentWeight = $("#nav1 li:nth-of-type(13) a").parent("li").width();
            var current = $("#nav1 li:nth-of-type(13) a").parent("li").position();
            $("#nav1 .slide-one").css({ top: current.top, width: currentWeight, opacity: 1 }); // 初始设置就显示，不需要等待动画
        });
        function searchBooks() {
    // 获取搜索输入框的值
    var searchTerm = document.getElementById('searchInput').value.toLowerCase();
    
    // 获取所有.books容器
    var booksContainers = document.querySelectorAll('.books');
    
    // 遍历每个.books容器
    booksContainers.forEach(function(container) {
        // 获取容器内的所有可搜索元素（这里假设是.book）
        var books = container.querySelectorAll('.bookcontainer');
        
        // 遍历每个书籍元素
        books.forEach(function(book) {
            // 重置为显示（如果需要的话）
            book.style.display = 'block';
            
            // 搜索书籍标题和描述（或其他你想要的元素）
            var title = book.querySelector('h3');
            var description = book.querySelector('p');
            
            // 检查标题和描述是否包含搜索词
            if (
                (!title || title.textContent.toLowerCase().indexOf(searchTerm) === -1) &&
                (!description || description.textContent.toLowerCase().indexOf(searchTerm) === -1)
            ) {
                // 如果都不包含，则隐藏书籍元素
                book.style.display = 'none';
            }
        });
    });
}
        </script>
</body>

</html>